谷歌浏览器(Google Chrome)怎么查看网页源代码?(谷歌浏览器查看源代码快捷键)

您所在的位置:网站首页 谷歌浏览器 源代码 谷歌浏览器(Google Chrome)怎么查看网页源代码?(谷歌浏览器查看源代码快捷键)

谷歌浏览器(Google Chrome)怎么查看网页源代码?(谷歌浏览器查看源代码快捷键)

2023-07-26 22:55| 来源: 网络整理| 查看: 265

本文介绍了如何在 Google Chrome 浏览器中访问网站的 HTML 源代码,以及如何访问和使用 Chrome 的开发人员工具。查看站点的源代码是初学者学习 HTML 的绝佳方式。

谷歌浏览器(Google Chrome)怎么查看网页源代码?谷歌浏览器(Google Chrome)怎么查看网页源代码?内容摘要右键单击网页并选择“查看网页源代码”。快捷方式:按Ctrl + U (Windows 系统) 或Command + Option + U (Mac 电脑)。要使用开发人员工具,请选择 Chrome 浏览器工具栏最右侧的三个点 >更多工具>开发人员工具。在 Chrome 中查看源代码

那么如何查看一个网页的源代码呢?以下是使用 Google Chrome 浏览器查看网页源代码的方法。

右键查看源代码

第 1 步:打开Google Chrome 浏览器(如果还没有安装Google Chrome,可以通过官网或360软件管家之类渠道免费下载)。

第 2 步:导航到要检查源代码的网页。

第 3 步:右键单击页面并选择查看网页源代码。

右键单击页面并选择查看网页源代码右键单击页面并选择查看网页源代码快捷键查看源代码

如果在 Windows 系统上,在谷歌浏览器中打开目标网页,然后按 Ctrl + U 键盘快捷键,就会打开对应页面的源代码。如果在 Mac 电脑上,在谷歌浏览器中打开目标网页,然后按 Command + Option + U 快捷键。

使用 Chrome 的开发者工具

除了利用Google Chrome 浏览器查看页面源代码之外,我们还可以利用浏览器的开发人员工具。这个工具不仅能让我们看到网页的 HTML 代码,还能查看网页 HTML 中对应元素的 CSS 样式表规则。

要使用 Chrome 的开发人员工具:

第 1 步:打开谷歌浏览器。

第 2 步:导航到目标网页。

第 3 步:选择浏览器窗口右上角的三个点。

第 4 步:从菜单中,依次选择:更多工具 > 开发人员工具。

更多工具 开发人员工具更多工具 > 开发人员工具

第 5 步:将打开一个开发者工具窗口。浏览器上方显示的网页内容,下方为开发者工具窗口。

打开谷歌浏览器开发人员工具窗口打开谷歌浏览器开发人员工具窗口

第 6 步:或者,右键单击网页中的某个元素,然后从出现的菜单中选择“检查”,Chrome 的开发人员工具窗口将弹出,并突出显示点选的 HTML 页面元素,在右侧还显示对应原色的 CSS 样式规则。

查看特定页面元素的源代码和样式查看特定页面元素的源代码和样式

作者:牛奇网,本站文章均为辛苦原创,在此严正声明,本站内容严禁采集转载,面斥不雅请好自为之,本文网址:https://www.niuqi360.com/windows/view-html-source-in-chrome/



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3